<template>
  <div class="agreement">
    <div class="underline" style="width:120px;">
      <span class="title1 color1 zIndex fontBold">入会协议</span>
    </div>
    <div class="agreement_content font400 content3 color3">
      <!-- 深圳市房地产业协会成立于1989年，登记证号：社证字第00001号，是由在深圳市从事房地产开发、与房地产相关的咨询以及房地产研究的企事业单位自愿组成的非营利性行业组织，现有会员单位1054家，其中会长单位1家、副会长单位64家、常务理事单位36家、理事单位79家、普通会员单位871家、监事长单位1家、监事单位2家。
      受深圳市住房和建设局委托，深圳市房地产业协会负责我市房地产开发企业资质年报、市场巡察监管、行业投诉、诚信系统公示、项目手册的管理和维护等工作。通过对我市1000余家开发企业、40000多名从业人员、3000多个开发项目的动态管理，深圳市房地产行业诚信评价体系、项目手册已成为政府行业监管的一项重要举措，不仅为政府获取行业发展信息提供了重要一手资讯，更成为开发企业对外公示，接受社会公众监督的重要平台。 -->
      <div class="sq_xs">
        <div style="height: 10px; width: 100%"></div>
        <div class="cont" ref="scroll">
          <!-- <div class="title sq_tilte content_line_height">申请入会+</div> -->
          <div class="cont-t">各房地产开发单位，各位专家、专业人士：</div>
          <p>
            深圳市房地产业协会,简称深圳房协,英文名称:SHENZHEN REAL ESTATE
            ASSOCIATION(缩写SREA)。深圳房协成立于1989年10月5日，登
            记证号：社证字第00001号，是由在深圳市从事房地产开发、与房地产相关的咨询以及房地产研究的企事业单位自愿组成的非营利性行业组织，现有会员单位{{
                associationObj.member_total
            }}家，其中会长单位{{ associationObj.hz_dw }}家，副会长单位{{
    associationObj.fhz_dw
}}家，常务理事单位{{ associationObj.cwls_dw }}家， 理事单位{{
    associationObj.ls_dw
}}家，普通会员单位{{ associationObj.pthy_dw }}家，监事长单位{{
    associationObj.jsz_dw
}}家，监事单位{{ associationObj.js_dw }}家。
          </p>
          <p>
            受深圳市规划和国土资源委员会委托，充分发挥行业协会桥梁纽带作用，深圳市房地产业协会负责我市房地产开发企业资质年检、市场巡察监管、行业投诉、诚信系统公示、项目手册的管理和维护等
            工作。目前已对我市注册{{
                associationObj.d_enterprise
            }}家房地产开发企业、{{ associationObj.employees }}余名从业人员、{{
    associationObj.property
}}多个开发项目实现了动态管理，其中房地产行业诚信评价体系、
            项目手册已成为政府行业监管的一项重要举措，不仅为政府获取行业发展信息提供了重要一手资讯，更成为开发企业对外公示，接受社会公众监
            督的重要平台。
          </p>

          <p>
            <span>深圳市房地产业协会在主管部门的指导下，依照法律、法规、规章和行业组织章程，实行房地产行业自律管理,其主要职能有：</span>
            <span>（一）制定并组织实施本行业的行规行约，建立行业自律机制和会员信用记录；</span>
            <span>（二）对违反行业组织章程或者行规行约、损害行业整体利益者，采取相应的行业自律措施；</span>
            <span>（三）开展行业培训、交流、咨询、展览等活动，推广应用新材料、新技术、新工艺，提升行业素质以及产品和服务质量；</span>
            <span>（四）发布市场和行业信息，推荐行业产品或者服务，提供技术咨询；</span>
            <span>（五）宣传房地产法律法规及相关政策；</span>
            <span>（六）规范行业行为，客观公正地协调会员之间、会员与非会员之间、会员与政府之间，会员与消费者之间的矛盾纠纷，发挥其维护社会公共利益的作用；</span>
            <span>（七）协助政府部门开展行业调查、决策咨询及产业政策制订等活动，向政府有关部门反映涉及行业利益的事项，提出意见和建议，维护本行业的利益及会员的合法权益；</span>
            <span>（八）承担主管部门委托的行业管理工作，对行业行为进行检查和评价；</span>
            <span>（九）法律、法规、规章授权或者政府部门委托以及行业组织章程规定的其他职能。</span>
          </p>
          <p>
            深圳市房地产业协会的宗旨：代表会员意愿，维护会员合法权益，为会员提供服务，协调会员之间关系，沟通会员与政府的联系，传达政府政策意图，维护公平竞争，为提高人民居住水平，促进城镇建设，建立健康有序的房地产业，构建社会主义和谐社会服务。
          </p>
          <p>
            本着服务企业、服务政府、服务大众的宗旨，协会积极开展各项活动，为行业搭建了交流的平台，编辑并免费派发《深圳房地产》月刊，设立深圳市房地产业协会网站（http://www.srea.net.cn）。近几年我协会还被市民政局评为先进民间组织和自律与诚信建设先进单位，成为我市较具影响力的行业组织。
          </p>
          <p>
            为了更好地适应深圳现代化城市建设的需要，更好地发挥协会的职能作用，进一步加强房地产行业的沟通，加强与政府之间的联系，传递信息，促进我市房地产业的健康有序发展，诚意邀请贵单位为我协会的会员单位。因您的参与，深圳市房地产业协会将增添一份力量！
          </p>
          <div class="cont-t">会员的权利与义务:</div>
          <p>
            <span>详情请点击查看《深圳市房地产业协会章程》</span>
            <span>单位会员应按照《深圳市房地产业协会章程》中规定缴纳会费条款，每年向协会交纳一次会费。</span>
            <span>根据《深圳市房地产业协会章程》规定，会费标准：</span>
            <span>(1）副会长单位每年缴纳会费50000元</span>
            <span>(2）常务理事单位每年缴纳会费20000元</span>
            <span>(3）理事单位每年缴纳会费15000元</span>
            <span>(4）会员单位每年缴纳会费8000元</span>
            <span class="orange">户 名：深圳市房地产业协会</span>
            <span class="orange">帐 号：4430 6612 0012 0150 05738</span>
            <span class="orange">开户行：交通银行深圳燕南支行</span>
          </p>
          <div class="cont-t">入会手续：</div>
          <p>
            <span>申请入会的单位，请填写《会员入会申请表》（见附页），同时将以下资料一并递交我协会：</span>
            <span>(1）企业营业执照；</span>
            <span>(2）企业资质证书。以上两项须提交原件及复印件，原件审核后即退还。</span>
            <span>(3）属不发资质证书的企业，只递交营业执照即可。</span>
          </p>
          <div class="cont-t">联系方式：</div>
          <p>
            <span>地址：{{ associationObj.address }} </span>
            <span>邮编：{{ associationObj.post_code }}</span>
            <span>电话：{{ associationObj.phone }}</span>
            <span>联系人：{{ associationObj.contacts }}</span>
            <!-- <span>传真：{{ associationObj.fax }} </span> -->
            <span>电子邮箱：{{ associationObj.email }}</span>
            <span>网址： {{ associationObj.website }}</span>
          </p>
          <div class="cont-t">附件下载：</div>
          <p>
            <span @click="downPdf(associationObj.file1)" class="orange">附件1：《会员入会申请表》点击下载</span>
          </p>
          <p>
            <span @click="downPdf(associationObj.file2)" class="orange">附件2：《深圳市房地产业协会章程》点击下载</span>
          </p>
          <img src="@/assets/img/QRcode.png" alt />
        </div>
        <div style="height: 30px; width: 100%"></div>
      </div>
    </div>
  </div>
  <div class="fexd_footer">
    <div class="footer_btn flex align_center justify_between">
      <div @click="back" class="btn_item cancle font400 content3 color4">
        取消
      </div>
      <div @click="filldata" class="btn_item agree font400 content3 color4">
        同意
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { useStore } from 'vuex'
import { getAssociations } from '@/api'
const router = useRouter()
const store = useStore()

const back = () => {
  if (store.state.from.path !== '/') {
    router.back()
  } else {
    router.replace('/')
  }
}

const associationObj: any = ref({})

const getAssociationslist = async () => {
  const res: any = await getAssociations()
  associationObj.value = res[0]
  console.log(res)
}

const downPdf = (file: any) => {
  // window.location.href = file
  console.log(file)
  const link = document.createElement('a')
  link.setAttribute('href', file)
  link.setAttribute('download', 'word.docx')
  link.target = '_blank'
  link.style.visibility = 'hidden'
  document.body.appendChild(link)
  link.click()
  document.body.removeChild(link)
}

console.log(associationObj)

getAssociationslist()

const filldata = () => {
  router.push('/filldata')
}

</script>

<style lang="less" scoped>
.agreement {
  padding: 0 30px 80px;
  margin-top: 40px;

  .agreement_content {
    margin-top: 20px;
    padding: 15px;
    background-color: #fff;
    border-radius: 5px;
    line-height: 25px;

    img {
      width: 100%;
    }
  }
}

.fexd_footer {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70px;
  background-color: #fff;
  box-shadow: 0px 2px 12px 2px rgba(22, 12, 6, 0.09);

  .footer_btn {
    padding: 0 30px;
    height: 100%;

    .agree {
      width: 140px;
      height: 44px;
      background: #ff7a1f;
      border-radius: 5px;
      text-align: center;
      line-height: 44px;
    }

    .cancle {
      width: 140px;
      height: 44px;
      background: #85898c;
      border-radius: 5px;
      text-align: center;
      line-height: 44px;
    }
  }
}

@media (min-width: 750px) {
  .agreement {
    padding: 0 30px 80px;
    margin-top: 40px;

    .agreement_content {
      margin-top: 20px;
      padding: 15px;
      background-color: #fff;
      border-radius: 5px;
      line-height: 25px;
    }
  }

  .fexd_footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 70px;
    background-color: #fff;
    box-shadow: 0px 2px 12px 2px rgba(22, 12, 6, 0.09);

    .footer_btn {
      padding: 0 30px;
      height: 100%;

      .agree {
        width: 140px;
        height: 44px;
        background: #ff7a1f;
        border-radius: 5px;
        text-align: center;
        line-height: 44px;
      }

      .cancle {
        width: 140px;
        height: 44px;
        background: #85898c;
        border-radius: 5px;
        text-align: center;
        line-height: 44px;
      }
    }
  }
}

// .flex-row {
//   display: flex;
//   flex-direction: row;
// }

// .flex-col {
//   display: flex;
//   flex-direction: column;
// }

// .nav {
//   position: fixed;
//   width: 275px;
// }

// .nav_b {
//   position: absolute;
//   bottom: 575px;
// }

// .cont {
//   padding: 35px;
//   background-color: #fff;
//   // box-shadow: 3px 5px 12px 0px rgba(208, 133, 79, 0.2);
//   flex: 1;
// }

// .cont span {
//   display: block;
// }

// .title {
//   font-weight: bold;
//   color: #f57d3c;
//   line-height: 48px;
//   width: 100%;
//   /* height: 30px; */
//   padding-bottom: 20px;
//   border-bottom: 1px solid #dedede;
// }

// .cont-t {
//   color: #1f1f1f;
//   font-size: 16px;
//   line-height: 26px;
//   font-weight: bold;
// }

// .cont>p {
//   color: #666;
//   font-size: 14px;
//   line-height: 26px;
//   margin-bottom: 20px;
// }

.orange {
  color: #f57d3c;
  font-weight: bold;
}

// @media (max-width: 750px) {
//   .cont {
//     background-color: #fff;
//     padding: 5px 10px 20px 10px;
//     position: relative;
//     // box-shadow: 3px 5px 12px 0px rgba(208, 133, 79, 0.2);

//     img {
//       width: 100%;
//     }
//   }

//   .title {
//     padding: 5px 0;
//     margin-bottom: 10px;
//   }

//   .cont>p:first-child {
//     margin-top: 45px;
//   }

//   .cont>p {
//     color: #666666;
//   }
// }
</style>
